<%@page pageEncoding="UTF-8" isELIgnored="false" session="false"%>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions"%>
<%@taglib prefix="f" uri="http://www.slim3.org/functions"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta http-equiv="content-language" content="ja">
<meta http-equiv="Cache-Control" content="no-cache">
<meta http-equiv="Pragma" content="no-cache">
<title>テーブルのテスト1</title>

<style>
    <style type="text/css">

        body

        {

            width: 900px;

        }

        p

        {

            float:left;

            width: 100%;

            margin: 20px 0px;

        }

        .fixedColumn .fixedTable td

        {

            color: #FFFFFF;

            background-color: #187BAF;

            font-size: 12px;

            font-weight: normal;

        }



        .fixedHead td, .fixedFoot td

        {

            color: #FFFFFF;

            background-color: #187BAF;

            font-size: 12px;

            font-weight: normal;

            padding: 5px;

            border: 1px solid #187BAF;

        }

        .fixedTable td

        {

            font-size: 8.5pt;

            background-color: #FFFFFF;

            padding: 5px;

            text-align: left;

            border: 1px solid #CEE7FF;

        }

</style>

 <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.1/jquery.min.js"></script>
 <script type="text/javascript" src="http://www.novasoftware.com/Download/jQuery_FixedTable/jquery.fixedtable.js"></script>

<script>

	$(document).ready(function() {

	    $(".tableDiv").each(function() {

	        var Id = $(this).get(0).id;

	        var maintbheight = 555;

	        var maintbwidth = 760;



	        $("#" + Id + " .FixedTables").fixedTable({

	            width: maintbwidth,

	            height: maintbheight,

	            fixedColumns: 1,

	            classHeader: "fixedHead",

	            classFooter: "fixedFoot",

	            classColumn: "fixedColumn",

	            fixedColumnWidth: 150,

	            outerId: Id,

	            Contentbackcolor: "#FFFFFF",

	            Contenthovercolor: "#99CCFF",

	            fixedColumnbackcolor:"#187BAF",

	            fixedColumnhovercolor:"#99CCFF"

	        });

	    });

	});

</script>

</head>
<body>


<h1>テーブルのテスト1</h1>


<a href="./table2">再表示</a><br/><br/>

<div id="tableDiv_Arrays" class="tableDiv">
<table id="Open_Text_Arrays" class="FixedTables">
	<thead>
		<tr>
			<th>カラム１</th>
			<th>カラム２</th>
			<th>カラム３</th>
			<th>カラム４</th>
			<th>カラム５</th>
			<th>カラム６</th>
			<th>カラム７</th>
		</tr>
	</thead>
	<tbody>
		<c:forEach items="${dataList}" var="line" >
			<tr>
				<td>${line.str1}</td>
				<td>${line.str2}</td>
				<td>${line.str3}</td>
				<td>${line.str4}</td>
				<td>${line.str5}</td>
				<td>${line.str6}</td>
				<td>${line.str7}</td>
			</tr>

		</c:forEach>

	</tbody>

</table>
</div>



</body>
</html>
